import React, { Component } from 'react'
import PropTypes from 'prop-types';
import {Card, WhiteSpace,WingBlank} from 'antd-mobile'
import {withRouter} from 'react-router-dom'

@withRouter
export default class UserCard extends Component {
    static propType = {
        userList: PropTypes.array.isRequired
      }
    handleClick(v){
        this.props.history.push(`/chat/${v._id}`)
    }
    render() {
        return (
            <WingBlank>
                <WhiteSpace></WhiteSpace>
                {this.props.userList.map(v=>(
                    v.avatar ? <Card 
                                onClick={()=>this.handleClick(v)}
                            key={v._id}>
                        <Card.Header
                            title={v.user}
                            thumb={require(`../avatar-selector/img/${v.avatar}.png`)}
                            extra={<span>{v.title}</span>}
                        >

                        </Card.Header>
                        <Card.Body>
                            {v.type === 'boss' ? <div>公司：{v.company}</div> : null}
                            {v.desc.split('\n').map((v,index)=>(
                                <div key={index}>{v}</div>
                            ))}
                            {v.type === 'boss' ? <div>薪资：{v.money}</div> : null}
                        </Card.Body>
                    </Card> : null        
                ))}
            </WingBlank>
        )
    }
}
